<template>
  <div>
    <div class="footer">
      <!-- 脚注头部 -->
      <div class="footer_nav">
        <div class="wrapper">
          <div class="top">
            <ul>
              <li><a href="https://jpzx.gxmu.edu.cn/">教评在线</a></li>
              <li><a href="https://ylxq.gxmu.edu.cn/">玉林校区</a></li>
              <li><a href="https://www.gxmu.edu.cn/xwgk/xxzc/">学校文件</a></li>
              <li><a href="https://jwc.gxmu.edu.cn/">教务在线</a></li>
              <li><a href="https://lib.gxmu.edu.cn/">图书馆</a></li>
              <li><a href="https://rwyx.gxmu.edu.cn/">人文医学</a></li>
              <li><a href="https://www.gxmu.edu.cn/zhxy/ydyx/">门户邮件</a></li>
              <li><a href="https://www.gxmu.edu.cn/vpn.html">VPN</a></li>
              <li><a href="https://xlzx.gxmu.edu.cn/">心理咨询</a></li>
            </ul>
          </div>
          <div class="bottom">
            <h3>友情链接：</h3>
            <select name="" id="">
              <option value="教育资源">教育资源</option>
            </select>
            <select name="" id="">
              <option value="兄弟院校">兄弟院校</option>
            </select>
            <select name="" id="">
              <option value="学习考试">学习考试</option>
            </select>
            <select name="" id="">
              <option value="知识社区">知识社区</option>
            </select>
          </div>
        </div>
      </div>
      <!-- 脚注底部 -->
      <div class="footer_bottom">
        <div class="wrapper">
          <!-- logo -->
          <div class="logo">
            <a href="#">
              <img src="../assets/yxtx/footer-sydw.png" alt="" />
            </a>
          </div>
          <!-- 版权 -->
          <div class="copyright">
            <p>
              版权：广西医科大学
              <span>广西南宁双拥路22号</span>
              <span>邮编：530021</span>
              <span>校办电话：0771-5352512</span>
            </p>
            <p>
              <img src="../assets/yxtx/footer_gongan.png" alt="" />
              网站备案号：桂ICP备05004851号-3
            </p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style lang="scss" scoped>
.footer {
  width: 100%;
  .footer_nav {
    box-sizing: border-box;
    padding-top: 10px;
    height: 94px;
    background-color: #f5f5f5;
    .wrapper {
      .top {
        overflow: hidden;
        ul {
          li {
            float: left;
            a {
              font-size: 14px;
              padding: 15px;
            }
          }
        }
      }
      .bottom {
        margin-top: 20px;
        h3 {
          float: left;
          padding: 0;
          margin: 0;

          font-weight: 300;
          font-size: 14px;
          color: #85360b;
          margin-left: 17px;
        }
        select {
          float: left;
          font-size: 12px;
          color: rgb(56, 48, 48);

          appearance: none;
          padding: 2px;
          border-width: 1px;
          border-style: solid;
          border-color: rgb(204, 204, 204);
          width: 192px;
          height: 22px;
          border-image: initial;
          background: url(http://ourjs.github.io/static/2015/arrow.png) right
            center no-repeat scroll rgb(255, 255, 255);
          margin: 0 13px;
        }
      }
    }
  }
  .footer_bottom {
    width: 100%;
    height: 150px;
    background-color: #fff;
    .logo {
      float: left;
      margin-left: 270px;
      margin-top: 50px;
    }
    .copyright {
      float: left;
      width: 543px;
      height: 75px;
      // background: pink;
      margin: 43px 28px 0 40px;
      p {
        font-size: 12px;
        color: #333;
        text-align: center;
        span {
          margin-left: 30px;
        }
        img {
          vertical-align: middle;
          margin-right: 10px;
        }
      }
      p:nth-child(2) {
        margin-top: 20px;
      }
    }
  }
}
</style>